<template>
    <div class="contents">
        <el-col :span="2">
            <el-menu :default-active="defaultActive" class="el-menu-vertical-demo"
                background-color="rgba(12, 37, 86, 1)" text-color="rgba(255, 255, 255, 0.8)" :router="true">
                <el-submenu :index="indexes + ''" v-for="(item, indexes) in newPeimission" :key="indexes">
                    <template slot="title">
                        <span>{{ item.stair }}</span>
                    </template>
                    <el-menu-item :index="items.path" v-for="(items, indexs) in item.secondLevel" :key="indexs">{{
                        items.name
                    }}</el-menu-item>
                </el-submenu>
            </el-menu>
        </el-col>
        <router-view></router-view>
    </div>
</template>

<script>
export default {
    methods: {
        getRole(id) {
            this.$axios.post('http://127.0.0.1/role/someRole', {
                id
            }, {
                headers: {
                    'Authorization': `Bearer ${localStorage.getItem('token')}`,
                    'Content-Type': 'application/json' // 如果需要发送 JSON 数据，则包含此行 // 设置请求头
                }
            }).then(res => {
                const permission = res.data.Permission.split(',')
                this.newPeimission = this.titleArr.filter(item => permission.includes(item.stair))
                // this.defaultActive = this.newPeimission[0].secondLevel[0].path
                // if(this.$route.path!= '/index/'+this.defaultActive){
                    
                //     this.$router.push('/index/'+this.defaultActive)
                // }



            }).catch(err => {
                console.log(err);
            })
        }
    },
    data() {
        return {
            titleArr: [
                {
                    stair: "首页",
                    secondLevel: [{
                        name: "工作台",
                        path: 'workbench'
                    },
                    {
                        name: "物业大屏",
                        path: 'screen'
                    }, {
                        name: "物业大屏配置",
                        path: 'screenconfigue'
                    }],
                },
                {
                    stair: "智慧物业",
                    secondLevel: [
                        {
                            "name": "房屋管理",
                            "path": "buildManagement"
                        },
                        {
                            "name": "楼表盘",
                            "path": "towerDial"
                        },
                        {
                            "name": "员工管理",
                            "path": "employeeManagement"
                        },
                        {
                            "name": "住户管理",
                            "path": "residentManagement"
                        },
                        {
                            "name": "住户确认",
                            "path": "residentVerification"
                        },
                        {
                            "name": "团队管理",
                            "path": "teamManagement"
                        },
                        {
                            "name": "缴费管理",
                            "path": "paymentManagement"
                        },
                        {
                            "name": "投诉建议",
                            "path": "complaintsAndSuggestions"
                        },
                        {
                            "name": "维修处理",
                            "path": "maintenanceHandling"
                        },
                        {
                            "name": "装修报备",
                            "path": "decorationReporting"
                        }
                    ]
                },
                {
                    stair: "内容管理",
                    secondLevel: [
                        {
                            "name": "社区活动",
                            "path": "communityActivities"
                        },
                        {
                            "name": "社区公告",
                            "path": "communityAnnouncements"
                        },
                        {
                            "name": "广告推荐位",
                            "path": "adRecommendationPosition"
                        },
                        {
                            "name": "信息公开",
                            "path": "informationDisclosure"
                        }
                    ]
                },
                {
                    stair: "门禁管理",
                    secondLevel: [
                        {
                            "name": "出入记录",
                            "path": "accessRecords"
                        },
                        {
                            "name": "门禁权限",
                            "path": "doorAccessPermissions"
                        },
                        {
                            "name": "访客管理",
                            "path": "visitorManagement"
                        },
                        {
                            "name": "出入二维码",
                            "path": "qrCodeAccess"
                        },
                        {
                            "name": "SIM门禁管理",
                            "path": "simCardDoorAccessManagement"
                        },
                        {
                            "name": "可视门禁权限",
                            "path": "visualDoorAccessPermissions"
                        },
                        {
                            "name": "卡片管理",
                            "path": "cardManagement"
                        },
                        {
                            "name": "门禁设备",
                            "path": "doorAccessDevices"
                        }
                    ]

                },
                {
                    stair: "视频监控",
                    secondLevel: [
                        {
                            "name": "账号管理",
                            "path": "accountManagement"
                        },
                        {
                            "name": "实时监控",
                            "path": "realTimeMonitoring"
                        },
                        {
                            "name": "视频回放",
                            "path": "videoPlayback"
                        },
                        {
                            "name": "识别记录",
                            "path": "recognitionRecords"
                        },
                        {
                            "name": "视频设备",
                            "path": "videoDevices"
                        },
                        {
                            "name": "抓拍记录",
                            "path": "captureRecords"
                        },
                        {
                            "name": "数据同步",
                            "path": "dataSynchronization"
                        }
                    ]

                },
                {
                    stair: "智慧停车",
                    secondLevel: [{ "name": "车辆管理", "path": "vehicleManagement" },
                    { "name": "停车场管理", "path": "parkingManagement" }]
                },
                {
                    stair: "水电气管理",
                    secondLevel: [
                        { "name": "水表设备", "path": "waterMeterDevices" },
                        { "name": "水表告警", "path": "waterMeterAlerts" },
                        { "name": "用水情况", "path": "waterUsage" },
                        { "name": "水表日用量", "path": "dailyWaterUsage" },
                        { "name": "水表充值记录", "path": "waterMeterRechargeRecords" },
                        { "name": "电表设备", "path": "electricityMeterDevices" },
                        { "name": "用电情况", "path": "electricityUsage" },
                        { "name": "电表日用量", "path": "dailyElectricityUsage" },
                        { "name": "电表充值记录", "path": "electricityMeterRechargeRecords" }
                    ]
                },
                {
                    stair: "智能预警",
                    secondLevel: [
                        { "name": "预警配置", "path": "alertConfiguration" },
                        { "name": "布控管理", "path": "controlManagement" },
                        { "name": "高空抛物", "path": "overheadObjectThrowing" },
                        { "name": "人员预警", "path": "personAlert" },
                        { "name": "车辆预警", "path": "vehicleAlert" },
                        { "name": "周界入侵", "path": "perimeterIntrusion" },
                        { "name": "电瓶车入梯", "path": "electricBikeInElevator" },
                        { "name": "消防通道占用", "path": "fireExitOccupation" },
                        { "name": "危险犬类识别", "path": "dangerousDogRecognition" }
                    ]
                },
                {
                    stair: "人员关怀",
                    secondLevel: [
                        { "name": "关怀对象", "path": "careObjects" },
                        { "name": "重点人员关怀", "path": "keyPersonCare" },
                        { "name": "关怀告警", "path": "careAlerts" }
                    ]
                },
                {
                    stair: "智慧防疫",
                    secondLevel: [
                        { "name": "通行二维码", "path": "accessQrCode" },
                        { "name": "电子通行证", "path": "electronicPass" },
                        { "name": "通行记录", "path": "accessRecord" },
                        { "name": "门磁管理", "path": "doorMagnetManagement" },
                        { "name": "门磁告警", "path": "doorMagnetAlerts" }
                    ]
                },
                {
                    stair: "智慧消防",
                    secondLevel: [
                        { "name": "烟感设备", "path": "smokeDetectorDevices" },
                        { "name": "烟感告警", "path": "smokeDetectorAlerts" }
                    ]
                },
                {
                    stair: "系统管理",
                    secondLevel: [
                        { "name": "角色管理", "path": "roleManagement" },
                        { "name": "业主权限", "path": "propertyOwnerPermissions" }
                    ]
                },
                {
                    stair: "活动管理",
                    secondLevel: [
                        { "name": "卡券管理", "path": "couponManagement" }
                    ]
                },
                {
                    stair: "电子通行证",
                    secondLevel: [
                        { "name": "通行二维码", "path": "accessCode" },
                        { "name": "电子通行证", "path": "electronic" },
                        { "name": "通行记录", "path": "access" }
                    ]
                }
            ],
            newPeimission: [],
            defaultActive: ''
        }
    },
    mounted() {
        this.getRole(localStorage.getItem('id'))
        this.defaultActive = this.$route.name
    }
}
</script>

<style scoped>
.el-submenu .el-menu-item {
    min-width: 150px !important;
}

.contents {
    display: flex;
}

.el-menu-vertical-demo>>>.el-menu--inline li {
    background: #003366 !important;
}

.el-menu-vertical-demo>>>.el-submenu__title:hover,
.el-menu-vertical-demo>>>.el-menu-item:hover {
    background-color: rgba(0, 51, 102, 1) !important;
}

.is-active {
    color: rgb(63, 170, 255);
}

.el-menu-vertical-demo {
    height: 100vh;
    overflow-y: auto;
    scrollbar-width: none;
    /* Firefox */
    -ms-overflow-style: none;
}

.el-menu-vertical-demo::-webkit-scrollbar {
    display: none;
}
</style>